HC: Avoid same BG/FG colors in flat treeview entry
authorDaniel Boles <dboles.src@gmail.com>
Wed, 20 Jun 2018 17:32:49 +0000 (18:32 +0100)
committerDaniel Boles <dboles.src@gmail.com>
Wed, 20 Jun 2018 18:15:21 +0000 (19:15 +0100)
Selected rows in tree views in HighContrast have a background colour the
same or nearly as the normal text colour, so we cannot let entries in
such rows have transparent backgrounds, or the text inside the entry
becomes nearly or totally impossible to see.

Dodge this by giving entry.flat inside treeview and with :focus the
$base_color, which is different from the text & so lets that be seen.

https://gitlab.gnome.org/GNOME/gtk/merge_requests/125

gtk/theme/HighContrast/_common.scss
gtk/theme/HighContrast/gtk-contained-inverse.css
gtk/theme/HighContrast/gtk-contained.css

index 0cb48c1c2bc2852dce58e9f626067a4f41cf0bf5..397a3179375385d3338987878f244cc6f4997b61 100644 (file)
@@ -215,6 +215,9 @@ entry {
         border-color: transparent;
         border-radius: 0;
         box-shadow: none;
+
+        // Dodge transparency in selected treeview row, else bg & fg end up same
+        treeview &:focus { background-color: $base_color; }
       }
     }
 
@@ -928,7 +931,6 @@ button:link, button:visited {
  * GtkSpinButton *
  *****************/
 spinbutton {
-   
   &:not(.vertical) {
     // in this horizontal configuration, the whole spinbutton
     // behaves as the entry, so we extend the entry styling
@@ -938,7 +940,6 @@ spinbutton {
     border-color: $borders_color;
     box-shadow: none;
     padding: 0;
-    
  
     entry {
       min-width: 28px;
index 49305bc6b18ca2c4b7d4ffd5ef3df9b98d2b213f..dc0365ee0156ff2ac8aa808bba1adf113927ee16 100644 (file)
@@ -92,6 +92,8 @@ spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-
 
 spinbutton.flat:focus:not(.vertical), spinbutton.flat:backdrop:not(.vertical), spinbutton.flat:disabled:not(.vertical), spinbutton.flat:not(.vertical), entry.flat:focus, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; background-image: none; border-color: transparent; border-radius: 0; box-shadow: none; }
 
+treeview spinbutton.flat:focus:focus:not(.vertical), treeview spinbutton.flat:backdrop:focus:not(.vertical), treeview spinbutton.flat:disabled:focus:not(.vertical), treeview spinbutton.flat:focus:not(.vertical), treeview entry.flat:focus:focus, treeview entry.flat:backdrop:focus, treeview entry.flat:disabled:focus, treeview entry.flat:focus { background-color: #111; }
+
 spinbutton:focus:not(.vertical), entry:focus { background-color: transparent; border-style: solid; background-image: linear-gradient(to bottom, #090909, #111 90%); border-color: #ddd; box-shadow: inset 0 2px 2px -2px #090909, inset 0 0 0 1px #ddd; }
 
 spinbutton:disabled:not(.vertical), entry:disabled { background-color: transparent; border-style: solid; background-image: linear-gradient(to bottom, #090909, #111 90%); color: gray; border-color: gray; background-image: linear-gradient(to bottom, #070707, #070707); box-shadow: none; }
index af4f54b0a192fa4b929c9a3d72b2de232026ef14..98ab363c39bac767466626bb693ebc097fbd0c2a 100644 (file)
@@ -92,6 +92,8 @@ spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-
 
 spinbutton.flat:focus:not(.vertical), spinbutton.flat:backdrop:not(.vertical), spinbutton.flat:disabled:not(.vertical), spinbutton.flat:not(.vertical), entry.flat:focus, entry.flat:backdrop, entry.flat:disabled, entry.flat { min-height: 0; padding: 2px; background-image: none; border-color: transparent; border-radius: 0; box-shadow: none; }
 
+treeview spinbutton.flat:focus:focus:not(.vertical), treeview spinbutton.flat:backdrop:focus:not(.vertical), treeview spinbutton.flat:disabled:focus:not(.vertical), treeview spinbutton.flat:focus:not(.vertical), treeview entry.flat:focus:focus, treeview entry.flat:backdrop:focus, treeview entry.flat:disabled:focus, treeview entry.flat:focus { background-color: #fff; }
+
 spinbutton:focus:not(.vertical), entry:focus { background-color: transparent; border-style: solid; background-image: linear-gradient(to bottom, #f7f7f7, #fff 90%); border-color: #000; box-shadow: inset 0 2px 2px -2px gray, inset 0 0 0 1px #000; }
 
 spinbutton:disabled:not(.vertical), entry:disabled { background-color: transparent; border-style: solid; background-image: linear-gradient(to bottom, #f7f7f7, #fff 90%); color: gray; border-color: gray; background-image: linear-gradient(to bottom, white, white); box-shadow: none; }